<template>
    <div class="index__menu">
        <grid class="index__menu--gridtop" :cols="5">
            <grid-item v-for="(menu,index) in indexMenuList" v-if="index<4" :key="index" @click.native="goMenu(menu)" class="index__menu--gridIteam">
                <!-- <img slot="icon" :src="menu.imgUrl"> -->
                <img slot="icon" :src="menu.imgUrl">
                <div slot="label">{{menu.serviceCname}}</div>
            </grid-item>
            <grid-item @click.native="gotoMenu('service')" class="index__menu--gridIteam">
                <!-- <img slot="icon" :src="menu.imgUrl"> -->
                <img slot="icon" src="~assets/x3/service/service_more.png">
                <div slot="label">更多</div>
            </grid-item>
        </grid>
    </div>
</template>

<script>
import { RequestUrl } from "src/common/url";
import Menu from 'src/js/menu';
import {
    FooterIndex,
    RouteUrl,
    Mutations,
    PopState,
    TO_TYPE,
    WeChatShare
} from "src/common/const";
import { Grid, GridItem } from "vux";
import { mapState, mapActions } from "vuex";
export default {
    computed: mapState(["hotInsuList", "indexMenuList", "adList", "colorRiskTyle", "user", "saveInsure", "shareUuid", "detailsStore"]),
    components: { Grid, GridItem, },
    data() {
        return {
            RouteUrl: {},
            showMore: false,
            swiperIndex: 0
        };
    },
    watch: {
    },
    filters: {

    },
    methods: {
        ...mapActions(["updatedPopState"]),
        gotoMenu(type) {
            this.updatedPopState(PopState.VUX_POP_IN);
            if (type == "service") {
                this.$common.goUrl(this, RouteUrl.SERVICE);
            } else {
                this.$common.goUrl(this, RouteUrl.INSURANCE);
            }
        },
        goMenu(menu) {
            let data = {
                _this: this,
                menu: menu,
            };
            Menu.goMenu(data);
        },
    },
    beforeRouteEnter(to, from, next) {
        localStorage["UUID_REF_URL"] = from.path;
        next();
    },
    mounted() {
        let _this = this;

        localStorage["ACTIVITY_BACK_URL"] = RouteUrl.INDEX;
        document.title = '恒华出行宝';
        $("html,body").animate({ scrollTop: "0px" }, 10);
        this.RouteUrl = RouteUrl;
    }
};
</script>

<style lang="scss" scoped >
.badge-value {
  font-size: 12px !important;
}

.index {
  background-color: #f0f0f0;
}

.index__menu {
  padding-bottom: 0px;
  background-color: #fff;
}

.index__menu--gridIteam {
  padding: 5px 0px 0px 0px !important;
  div {
    font-size: 13px;
  }
}

.index__menu {
  .weui-grid {
    height: 75.5px !important;
  }
}

.weui-grid:before {
  border: 0px !important;
}

.weui-grids:before {
  border: 0px !important;
}

.weui-grid:after {
  border: 0px !important;
}
</style>
